<template>
    <div class="am-g upload_wrap">
        <div class="am-u-sm-12">
            <form class="am-form am-scrollable-horizontal">
                <table class="am-table am-table-bordered am-table-striped am-text-nowrap am-table-centered">
                <thead>
                <tr>
                    <th class="table-title">广告名称</th>
                    <th class="table-budget">投放预算(元)</th>
                    <th class="table-balance">投放余额(元)</th>
                    <th class="table-price">基础投放价格(元/次)</th>
                    <th class="table-percent">红包占余额比例</th>
                    <th class="table-num">预估计费次数(次)</th>
                    <th class="table-area">红包金额弹性区间(元)</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>{{resultDate.adName}}</td>
                    <td>{{resultDate.releaseAmount}}</td>
                    <td>{{resultDate.advertiserBalance}}</td>
                    <td>{{resultDate.deliveyPrice}}</td>
                    <td>
                        <div class="am-u-sm-9 paddingRight0">
                            <input type="email" class="am-form-field am-input-sm" placeholder="" v-model="giftRatio" :disabled="!editable">
                        </div>
                        <label class="am-u-sm-2 labelLine">%</label>
                    </td>
                    <td>{{computeTimes}}</td>
                    <td>
                        <div class="am-u-sm-4 paddingRight0">
                            <input type="email" class="am-form-field am-input-sm" placeholder="" v-model="giftLowerLimit" :disabled="!editable">
                        </div>
                        <label class="am-u-sm-2 labelLine">下限</label>
                        <div class="am-u-sm-4 paddingRight0">
                            <input type="email" class="am-form-field am-input-sm" placeholder="" v-model="giftUpperLimit" :disabled="!editable">
                        </div>
                        <label class="am-u-sm-2 labelLine">上限</label>
                    </td>
                </tr>
                <tr class="textWrap">
                    <td>使用说明</td>
                    <td>如需要更改投放预算，请登录广告主系统更改</td>
                    <td>广告投放剩余金额</td>
                    <td>如需要更改投放预算，请登录广告主系统更改</td>
                    <td>填写比例</td>
                    <td>总预算减去红包部分的可计费次数</td>
                    <td>再基础投入价格上，用户可能中奖额范围</td>
                </tr>
                </tbody>
                </table>

                <hr />
                <br/>
            </form>
            <div class="am-margin textCenter">
                <div @click="handleCancel()" class="am-btn am-btn-warning am-btn-primary borderRadius4">取消</div>
                <div @click="handleSubmit()" class="am-btn am-btn-warning am-btn-primary borderRadius4">提交</div>
            </div>
        </div>
    </div>
</template>

<script>
import axios from 'axios'
import {url} from '../../../static/config'
export default {
  data () {
    return {
      slideNav: this.$route.query.upload || 'adalready',
      resultDate: {},
      id: '',
      adId: '',
      giftRatio: '', // 红包占用预算比例
      giftLowerLimit: '', // 红包下限
      giftUpperLimit: '', // 红包上限
      editable: this.$route.query.editable// 是否可编辑
    }
  },
  created () {
    var _this = this
    _this.id = _this.$route.query.id
    var adId = encodeURIComponent(_this.$route.query.adId)
    _this.adId = adId
    console.log('编辑选中', _this.$route.query.adId, adId)
    axios.post(url + '/web-adv/getAdGiftByAdId?adId=' + adId)
      .then(function (res) {
        // 已投放（查看/编辑）按钮，投放页面 选中按钮，查询投放红包信息
        var data = JSON.parse(res.data)
        // console.log('返回', data.result)
        _this.resultDate = data.result
        _this.giftRatio = data.result.giftRatio
        _this.giftLowerLimit = data.result.giftLowerLimit
        _this.giftUpperLimit = data.result.giftUpperLimit
      })
  },
  computed: {
    // 预估计费次数
    computeTimes: function () {
      var a = this.resultDate.advertiserBalance
      var b = this.resultDate.deliveyPrice
      var c = this.giftRatio
      var d = Math.floor(a * (1 - c / 100) / b)
      return isNaN(parseInt(d)) ? '---' : d
    }
  },
  methods: {
    handleCancel () {
      this.$router.go(-1)
    },
    handleSubmit () {
      var _this = this
      var status = _this.resultDate.status
      var giftRatio = _this.giftRatio
      var giftLowerLimit = _this.giftLowerLimit
      var giftUpperLimit = _this.giftUpperLimit
      // console.log('提交数据', status, giftRatio, giftLowerLimit, giftUpperLimit)
      var params = _this.slideNav === 'adalready'
        ? '/web-adv/setAdPlaceGift?id=' + _this.id + '&adId=' + _this.adId + '&status=' + status + '&giftRatio=' + giftRatio + '&giftLowerLimit=' + giftLowerLimit + '&giftUpperLimit=' + giftUpperLimit
        : '/web-adv/setAdPlaceGift?adId=' + _this.adId + '&giftRatio=' + giftRatio + '&giftLowerLimit=' + giftLowerLimit + '&giftUpperLimit=' + giftUpperLimit
      axios.post(url + params)
        .then(function (res) {
        // 修改提交、选中-提交 对应接口
          var data = JSON.parse(res.data)
          if (data.result) {
            _this.$router.go(-1)
          }
        })
    }
  }
}
</script>
